<template>
	<el-dialog width="800px" :close-on-click-modal="false"  :visible.sync="visible" :show-close="false" center>
		<div id="pdfDom">
			<img :src="qrCodeBase64" class="qrCode" />
			<h2 class="title">费&nbsp;&nbsp;&nbsp;用&nbsp;&nbsp;&nbsp;报&nbsp;&nbsp;&nbsp;销&nbsp;&nbsp;&nbsp;单</h2>
			<div class="top-info-container">
				<span class="info">报销部门：{{ dept }}</span>
				<span class="info">报销人：{{ name }}</span>
				<span class="info">报销日期：{{ date }}</span>
			</div>
			<div class="reim-table-container">
				<table class="reim-table">
					<tr align="center">
						<th width="30%">报销项目</th>
						<th width="34%">备注</th>
						<th width="20%">类别</th>
						<th width="16%">金额</th>
					</tr>
					<tr align="center" v-for="one in content">
						<td align="left">{{ one.title }}</td>
						<td align="left">{{ one.desc }}</td>
						<td>{{ one.type }}</td>
						<td align="left">{{ one.money != '' ? one.money + '元' : '' }}</td>
					</tr>
					<tr>
						<th align="center">报销合计</th>
						<td colspan="3">{{ amount }}元</td>
					</tr>
					<tr>
						<th align="center">人民币大写</th>
						<td colspan="3">{{ smalltoBIG(amount) }}</td>
					</tr>
					<tr>
						<td colspan="5">
							<div class="info-container">
								<span class="info">借款金额：{{ anleihen }}元</span>
								<span class="info">应退金额：{{ money_1 }}元</span>
								<span class="info">应补金额：{{ money_2 }}元</span>
							</div>
						</td>
					</tr>
				</table>
			</div>
			<div class="bottom-info-container"></div>
			<div class="bottom-info-container">
				<span class="sig">会计主管：</span>
				<span class="sig">复核：</span>
				<span class="sig">出纳：</span>
				<span class="sig">报销人：</span>
			</div>
		</div>
		<template #footer>
			<span class="dialog-footer">
				<el-button type="primary" @click="getPdf('#pdfDom')" size="medium">下载报销单</el-button>
				<el-button size="medium" @click="cancel()">关闭窗口</el-button>
			</span>
		</template>
	</el-dialog>
</template>

<script>
  import { listReim, getReim, delReim, addReim, updateReim,searchReimById } from "@/api/danny/reim";
export default {
	data: function() {
		return {
			visible: false,
			htmlTitle: '费用报销单',
			dept: null,
			name: null,
			date: null,
			amount: null,
			balance: null,
			anleihen: null,
			money_1: 0,
			money_2: 0,
			content: [],
			qrCodeBase64: null
		};
	},
	methods: {
		init: function(id) {
			let that = this;
			that.visible = true;
			that.dept = null;
			that.name = null;
			that.date = null;
			that.amount = null;
			that.balance = null;
			that.anleihen = null;
			that.money_1 = 0;
			that.money_2 = 0;
			that.content = [];
      // getReim(reimId).then(response => {
      //   this.form = response.data;
      //   this.danWorkflowReimgoodsList = response.data.danWorkflowReimgoodsList;
      //   this.open = true;
      //   this.title = "修改报销申请";
      // });
      searchReimById(id).then(resp => {
        that.dept = resp.data.dept;
        that.name = resp.data.name;
        that.date = resp.data.date;
        that.amount = resp.data.amount;
        that.balance = resp.data.balance;
        that.anleihen = resp.data.anleihen;
        if (that.anleihen > that.amount) {
          that.money_1 = that.anleihen - that.amount;
        } else if (that.anleihen < that.amount) {
          that.money_2 = that.amount - that.anleihen;
        }
        console.info(111);
        console.info(resp.data.danWorkflowReimgoodsList);
        // this.$alert(resp.data.danWorkflowReimgoodsList, '管理员不能创建流程', {
        //   confirmButtonText: '确定',
        // });
        let content = resp.data.danWorkflowReimgoodsList;//JSON.parse(resp.danWorkflowReimgoodsList);
        let temp = 5 - content.length;
        for (let i = 0; i < temp; i++) {
          content.push({ title: '', desc: '', type: '', money: '' });
        }
        that.content = content;
        that.qrCodeBase64 = resp.data.qrCodeBase64;
        console.info(222);
        console.info(222+resp.data.qrCodeBase64);
        // this.$alert(resp.data.qrCodeBase64, '管理员不能创建流程', {
        //   confirmButtonText: '确定',
        // });
      });
			// that.$http('/danny/workflow/reim/searchReimById', 'POST', { id: id }, true, function(resp) {
			// 	that.dept = resp.dept;
			// 	that.name = resp.name;
			// 	that.date = resp.date;
			// 	that.amount = resp.amount;
			// 	that.balance = resp.balance;
			// 	that.anleihen = resp.anleihen;
			// 	if (that.anleihen > that.amount) {
			// 		that.money_1 = that.anleihen - that.amount;
			// 	} else if (that.anleihen < that.amount) {
			// 		that.money_2 = that.amount - that.anleihen;
			// 	}
			// 	let content = JSON.parse(resp.content);
			// 	let temp = 5 - content.length;
			// 	for (let i = 0; i < temp; i++) {
			// 		content.push({ title: '', desc: '', type: '', money: '' });
			// 	}
			// 	that.content = content;
			// 	that.qrCodeBase64 = resp.qrCodeBase64;
			// });
		},
		cancel: function() {
			this.visible = false;
		},
		smalltoBIG: function(n) {
			var fraction = ['角', '分'];
			var digit = ['零', '壹', '贰', '叁', '肆', '伍', '陆', '柒', '捌', '玖'];
			var unit = [['元', '万', '亿'], ['', '拾', '佰', '仟']];
			var head = n < 0 ? '欠' : '';
			n = Math.abs(n);

			var s = '';

			for (var i = 0; i < fraction.length; i++) {
				s += (digit[Math.floor(n * 10 * Math.pow(10, i)) % 10] + fraction[i]).replace(/零./, '');
			}
			s = s || '整';
			n = Math.floor(n);

			for (var i = 0; i < unit[0].length && n > 0; i++) {
				var p = '';
				for (var j = 0; j < unit[1].length && n > 0; j++) {
					p = digit[n % 10] + unit[1][j] + p;
					n = Math.floor(n / 10);
				}
				s = p.replace(/(零.)*零$/, '').replace(/^$/, '零') + unit[0][i] + s;
			}
			return (
				head +
				s
					.replace(/(零.)*零元/, '元')
					.replace(/(零.)+/g, '零')
					.replace(/^整$/, '零元整')
			);
		}
	}
};
</script>

<style lang="less" scoped="scoped">
@import url('reim_pdf.less');
</style>
